﻿<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <title>聊天界面</title>
    <script src="/js/jquery/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="/css/chat.css"/>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <script src="/js/flexible.js"></script>
    <script src="/js/plugins/dialog2/dialog.css"></script>
    <script src="/js/plugins/dialog2/dialog.min.js"></script>
    <script src="/js/common.js"></script>
    <script>
        $(function () {
           /* var websocket;
            if ('WebSocket' in window) {
                console.log("此浏览器支持websocket");
                websocket = new WebSocket("localhost:8080/trip/websocketDemo/1");
            } else if ('MozWebSocket' in window) {
                alert("此浏览器只支持MozWebSocket");
            } else {
                alert("此浏览器只支持SockJS");
            }
            websocket.onopen = function (evnt) {
                $("#tou").html("链接服务器成功!")
            };
            websocket.onmessage = function (evnt) {
                $("#msg").html($("#msg").html() + "<br/>" + evnt.data);
            };
            websocket.onerror = function (evnt) {
            };
            websocket.onclose = function (evnt) {
                $("#tou").html("与服务器断开了链接!")
            }
            $('#send').bind('click', function () {
                send();
            });

            function send() {
                if (websocket != null) {
                    var message = document.getElementById('message').value;
                    websocket.send(message);
                } else {
                    alert('未与服务器链接.');
                }
            }*/

            //
            var params = getParams();
            $.get("/users/" + params.id, function (data) {
                console.log(data);
                $(".header").renderValues(data);
                //接收聊天的当前用户头像
                $("#headOne").attr("src", data.headImgUrl);
            });
            $(".right").click(function () {
                window.location.href = "/mine/userProfiles.html?id=" + params.id;
            });

            //发起聊天的当前用户头像
            var userString = sessionStorage.getItem("user");
            var user = JSON.parse(userString);
            console.log(userString);
            $("#headTwo").attr("src", user.headImgUrl);
        })
    </script>
</head>

<body>
<header class="header">
    <a class="back" href="javascript:history.back()"></a>
    <h5 class="tit" render-html="nickName"></h5>
    <div class="right">资料</div>
</header>
<form action="/socket">
    <div class="message">
        <div class="send">
            <div class="time"></div>
            <div class="msg">
                <!--头像-->
                <img src="" alt="" id="headOne"/>
                <!--内容-->
                <p><i class="msg_input"></i></p>
            </div>
        </div>
        <div class="show">
            <div class="time">05/22 06:30</div>
            <div class="msg">
                <!--头像-->
                <img src="" alt="" id="headTwo"/>
                <!--内容-->
                <p><i clas="msg_input"></i></p>
            </div>
        </div>
    </div>
     <div class="footer">
         <img src="/mines/picture/hua.png" alt=""/>
         <img src="/mines/picture/xiaolian.png" alt=""/>
         <input type="text" id="message"/>
         <p>发送</p>
     </div>
    <!--<div class="page-header" id="tou">
        webSocket多终端聊天测试
    </div>
    <div class="well" id="msg"></div>
    <div class="col-lg">
        <div class="input-group">
            <input type="text" class="form-control" placeholder="发送信息..." id="message">
            <span class="input-group-btn">
                    <button class="btn btn-default" type="button" id="send">发送</button>
                </span>
        </div>
    </div>-->
</form>
<script src="/js/chat.js" type="text/javascript" charset="utf-8"></script>
</body>

</html>